/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

import React, { useEffect, useState } from 'react';
import { message, Card, Descriptions } from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import KbSetting from '@/components/_pages/jdk/addLeague/compinents/KbSetting';
import AuthorityExtend from '@/components/_page/admin/editMenu/authority-extend';
import KbPlatTable from '@/components/_pages/jdk/addLeague/compinents/KbPlatTable';
import KbAuth from '@/components/_pages/jdk/addLeague/compinents/KbAuth';
import KbLoginModal from '@/components/KbLoginModal';
import type { Location } from 'umi';
import type { ConnectState } from '@/models/connect';
import { getDetailData } from '@/services/jdk/league';
import { formatDetailVal } from '@/components/_pages/jdk/utils/index.appRegister';
import KbSfDrawer from '@/components/_pages/jdk/registerTable/compontents/KbSfDrawer';
import { history, useLocation, useSelector } from 'umi';

const Index = () => {
  const { query: urlParams } = useLocation() as Location | any;
  const { winSize } = useSelector((state: ConnectState) => state.global);

  const { league_id } = urlParams;
  const detailType = {
    league_name: '服务商名称',
    contact_name: '联系人',
    level: '等级',
    is_black: '登录状态',
    phone: '服务商账号',
    contact_phone: '联系电话',
    address: '公司地址',
    shunfen: '顺丰独占账号',
  };
  const [record, setRecord] = useState<any>({});

  const getDetailDatas = async () => {
    const { code, data, msg } = await getDetailData({ league_id });
    if (code == 0) {
      setRecord(data);
    } else {
      message.error(msg);
    }
  };

  const handleComplete = () => {
    getDetailDatas();
  };

  const goBack = () => history.goBack();
  useEffect(() => {
    getDetailDatas();
  }, [urlParams]);
  return (
    <PageContainer>
      <Card
        title='商家详情'
        extra={[
          <a key='goBack' onClick={goBack}>
            返回上一页
          </a>,
        ]}
        style={{
          borderBottom: '24px solid #eef0f3',
        }}
      >
        <Descriptions column={{ xxl: 4, xl: 4, lg: 3, md: 2, sm: 2, xs: 1 }}>
          {Object.keys(detailType).map((item) => {
            const key = detailType[item];
            const value = formatDetailVal(record, item);
            return (
              <Descriptions.Item key={item} label={<strong>{key}</strong>}>
                {item === 'is_black' ? (value == '0' ? '正常' : '已禁止') : value}
                &nbsp;
                {item === 'is_black' ? (
                  <>
                    <KbLoginModal
                      actionRef={undefined}
                      item={record[item]}
                      status={record[item] == '0'}
                      api={'/jdk/League/leagueBlack'}
                      queryData={{ league_id }}
                      inhibitedApi={'/jdk/League/unLeagueBlack'}
                      inhibitedQueryData={{ league_id }}
                      reamrkApi='/jdk/League/leagueRemark'
                      reamrkQueryData={{ user_id: league_id }}
                      onComplete={handleComplete}
                    />
                  </>
                ) : item == 'shunfen' ? (
                  <KbSfDrawer
                    winSize={winSize}
                    onComplete={handleComplete}
                    queryData={{ league_id, type: 'league' }}
                    record={record[item]}
                  />
                ) : null}
              </Descriptions.Item>
            );
          })}
        </Descriptions>
      </Card>
      <AuthorityExtend level='1'>
        <KbSetting league_id={record.league_id} />
      </AuthorityExtend>
      <AuthorityExtend level='2'>
        <KbPlatTable league_id={record.league_id} />
      </AuthorityExtend>

      <KbAuth
        service_fee_enable={record.service_fee_enable}
        service_fee_expire_type={record.service_fee_expire_type}
        allow_set_delivery_status={record.allow_set_delivery_status}
        league_id={record.league_id}
        allow_login={record.allow_login}
        callBack={getDetailDatas}
      />
    </PageContainer>
  );
};

export default Index;
